<template>
  <div class="index-content">
    <Header></Header>
    <!-- <Bread></Bread> -->
    <div class="page-content">
      <router-view v-slot="{ Component }">
        <transition name="fade">
          <component :is="Component" />
        </transition>
      </router-view>
    </div>
  </div>
</template>

<script setup>
  import Header from './components/header.vue'
  import Bread from './components/breadRoute.vue'
</script>

<style scoped lang="scss">
  .index-content {
    @include wh100();
    min-width: 700px;
    display: flex;
    flex-direction: column;
    .page-content {
      height: calc(100% - #{pxTvh(56)});
      & > div {
        @include wh100();
        position: relative;
        overflow: hidden;
        // padding: 0 pxTvw(24) pxTvh(24);
        box-sizing: border-box;
        background-color: #000102;
      }
    }
  }
</style>
